
<script src="<?=base_url()?>assets/js/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="<?= $this->config->base_url(); ?>assets/js/ckeditor/ckeditor.js"></script>
<link rel="stylesheet" href="<?=base_url()?>assets/css/proposal_category_base.css" type="text/css" media="screen,print" title="" charset="utf-8">


<script type="text/javascript">
var GLOBAL_msg = null;
var ajaxRequest = null ;  // The variable that makes Ajax possible!

(function() {
   	// the DOM will be available here
   	//On Ready function
	//alert("On Ready");
	ajaxFetch(null,1);
})();


 $('#myTab a').click(function (e) {
  e.preventDefault();
  $(this).tab('show');
})

function ckeditor_dynamic_init()
	{
		var myTabDiv = document.getElementById('myTabContent');
		myTabDivLiArray = myTabDiv.getElementsByTagName('textarea');
		var myTabDivLiArray;	//My Tab List Array
		var arrayLiArray = [];
  		for (var i = myTabDivLiArray.length >>> 0; i--;) 
			{ 
				arrayLiArray[i] = myTabDivLiArray[i].getAttribute("id");
				CKEDITOR.replace(arrayLiArray[i]);
			}
	}       
    
/*
function addNewTab
	{
		var container = document.getElementById('myTab');
		var new_element = document.createElement('li');
		new_element.innerHTML = element;
		container.insertBefore(add_new_tab, container.firstChild);
	}

*/

function ajaxRequestPlatform()
	{
		try
			{
				// Opera 8.0+, Firefox, Safari
				ajaxRequest = new XMLHttpRequest();
			} 
		catch (e)
			{
				// Internet Explorer Browsers
				try
					{
						ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
					} 
				catch (e) 
					{
						try
							{
								ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
							} 
						catch (e)
							{
								// Bhenji Khabhi Chrome bhi use kiya karo
								alert("Bhenji Khabhi Chrome bhi use kiya karo!");
								return false;
							}
					}
			}
	}

function ajaxFetch(value_id,ajaxSendTo)
	{
		ajaxRequestPlatform();
		if(ajaxSendTo == 1)
			{
							// Create a function that will receive data sent from the server
				ajaxRequest.onreadystatechange = function()
					{
						if(ajaxRequest.readyState == 4 && ajaxRequest.status == 200)
							{
								document.getElementById("list_tree").innerHTML = ajaxRequest.responseText;
							}
					}
				/*
				var age = document.getElementById('age').value;
				var wpm = document.getElementById('wpm').value;
				var sex = document.getElementById('sex').value;
				var queryString = "?age=" + age + "&wpm=" + wpm + "&sex=" + sex;
				*/
				ajaxRequest.open("GET", "<?=base_url()?>user/proposal_management/tree_view", true);
				ajaxRequest.send(null);	
			}
		
		else if(ajaxSendTo == 2)
			{
				// Create a function that will receive data sent from the server
				ajaxRequest.onreadystatechange = function()
					{
						if(ajaxRequest.readyState == 4 && ajaxRequest.status == 200)
							{
								document.getElementById("dynamic_content").innerHTML = ajaxRequest.responseText;
								ckeditor_dynamic_init()
								//alert("ListUpadated");	
									/*								
										CKEDITOR.replace('categorydesc0');
										CKEDITOR.replace('categorydesc1');
										CKEDITOR.replace('categorydesc2');
									*/
							}
					}
				/*
				var age = document.getElementById('age').value;
				var wpm = document.getElementById('wpm').value;
				var sex = document.getElementById('sex').value;
				var queryString = "?age=" + age + "&wpm=" + wpm + "&sex=" + sex;
				*/
				var module_id = value_id;
				var queryString = "?module_id=" + module_id;
				ajaxRequest.open("GET", "<?=base_url()?>user/proposal_management/tab_view" + queryString, true);
				ajaxRequest.send(null);										
			}
			
		else if(ajaxSendTo == 3)
			{
				// Create a function that will receive data sent from the server
				ajaxRequest.onreadystatechange = function()
					{
						if(ajaxRequest.readyState == 4 && ajaxRequest.status == 200)
							{
								var tab_div = document.createElement('div');
								tab_div.setAttribute('class', 'tab-pane');
								tab_div.setAttribute('id', 'plan_'+tab_id);
								//alert(tab_id);
								
								//alert(ajaxRequest.responseText);
								document.getElementById("tab_form_input").appendChild(tab_div);
								var id = "plan_" + tab_id;
								document.getElementById(id).innerHtml = "Test";//ajaxRequest.responseText;
								
							}
					}
				/*
				var age = document.getElementById('age').value;
				var wpm = document.getElementById('wpm').value;
				var sex = document.getElementById('sex').value;
				var queryString = "?age=" + age + "&wpm=" + wpm + "&sex=" + sex;
				*/
				var tab_id = value_id;
				var queryString = "?tab_id=" + tab_id;
				ajaxRequest.open("GET", "<?=base_url()?>user/proposal_management/proposal_dynamic_tab" + queryString, true);
				ajaxRequest.send(null);										
			}		
	}


function tab_add()
{
	var liSize = document.getElementById('myTab').getElementsByTagName('li').length;
	var reference = document.getElementById('myTab').children[liSize-1];
	var myTabReference = document.getElementById('myTab');
	var liElement = document.createElement('li');
	liElement.setAttribute('id', 'li_plan_'+liSize);
	myTabReference.insertBefore(liElement, reference);

	var aElement = document.createElement('a');
	aElement.setAttribute('href', '#plan_'+liSize);
	aElement.setAttribute('id', 'anch_plan_'+liSize);
	aElement.setAttribute('data-toggle', 'tab');
	aElement.innerHTML = "Plan "+liSize+"&nbsp; ";
	document.getElementById('li_plan_'+liSize).appendChild(aElement);
	
	var iElement = document.createElement('i');
	iElement.setAttribute('class', 'icon-remove-sign');
	document.getElementById('li_plan_'+liSize).children[0].appendChild(iElement);
	ajaxFetch(liSize,3);
	/*
	var aElement = document.createElement('span');
	aElement.setAttribute('class', '');
	aElement.setAttribute('data-toggle', 'tab');
	aElement.innerHTML = "Plan "+liSize;
	document.getElementById('plan_'+liSize).appendChild(aElement);
	*/

}


document.onclick=function(e)
	{
		var node = e.srcElement == undefined ? e.target : e.srcElement;
		if (node.nodeName == "LI" || node.nodeName == "li" || node.nodeName == "SPAN" || node.nodeName == "span") 
			{
				var list_tree = document.getElementById('list_tree');
				list_tree.style.display = "inline";
				
				var id = node.getAttribute("id");	
				var splits = id.split("_",2);	//Split the id
				var classType = splits[0];
				var listId = splits[1];
				if(classType == "module")
					{
						ajaxFetch(listId,2);		
					}	
				/*
				id = id + node.nodeName;
				document.getElementById("DisplayInfo").innerHTML = ajaxRequest.responseText;
				*/
			}
		else if(node.nodeName == "A" || node.nodeName == "a")
			{
				//alert(node.nodeName);
				var id = node.getAttribute("id");
				//alert(id);
				//var tmp = document.id.children[0];
				//alert(tmp); 
				
			}
			
		else if(node.nodeName == "SPAN" || node.nodeName == "span")
			{
				//alert(node.nodeName);
				var id = node.getAttribute("id");
				//alert(id);
				var tmp = document.id.children[0];
				//alert(tmp); 
				
			}
			
		else if(node.nodeName == "I" || node.nodeName == "i")
			{
				//alert(node.nodeName);
				var id = node.getAttribute("class");
				//alert(id);
				//var tmp = document.id.children[0];
				//alert(tmp); 
				
			}				
			
	}

document.onmouseover=function(e)
	{
		var node = e.srcElement == undefined ? e.target : e.srcElement;
			if (node.nodeName == "LI" || node.nodeName == "li") 
				{
					node.style.fontWeight= "bold";
					showRollover(e, node.innerHTML);
				}
	}

document.onmouseout=function(e)
	{	
		var node = e.srcElement == undefined ? e.target : e.srcElement;
			if (node.nodeName == "LI" || node.nodeName == "li") 
				{
					node.style.fontWeight = "normal";
					clearRollover(e);
				}
	}
	
function showRollover(e, msg) 
	{
		if (!e) 
			{ 
				e = window.event;
			}
		if (GLOBAL_msg == null) 
			{
				GLOBAL_msg = msg;
			}
		var clientX = e.clientX + 15 + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
		var clientY = e.clientY + 10 + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
		var rollover = document.getElementById('Rollover');
		rollover.innerHTML = GLOBAL_msg;
		rollover.style.marginTop = clientY + "px";
		rollover.style.marginLeft = clientX + "px";
		rollover.style.display = "inline";
		document.onmousemove = showRollover;
	}
	
function clearRollover(e) 
	{
		if (!e) 
			{ 
				e = window.event;
			}
		var rollover = document.getElementById('Rollover');
		rollover.style.display = "none";
		GLOBAL_msg = null;
		document.onmousemove = null;
	}
		
</script>	

<div class='row-fluid'>
	
	<div id="dynamic_content" class='span8'>

	</div>
		
	<div class='span3 offset1' id="list_tree">				
		
	</div>

</div>						